:root {
  --primary-color: #f7f7f7;
  --secondary-color: #212121;
  --lightgrey: #efefef;
  --darkgrey: #646464;
  --navbg: #121212;
  --navcol: #fff; 
  --linkcol: #000;
  --gold:#E3AA4C;
  --blue:#009fdf;
}
/* root variables cannot be used in media queries so here for reference only:
  36em/57.6rem phone (Small devices (landscape phones, 576px and up)
  48em/76.8rem tablet (Medium devices (tablets, 768px and up)
  62em/99.2rem desktop (Large devices (desktops, 992px and up)
  75em/120rem large desktop (Large devices (desktops, 1200px and up)
  120em/192rem Pro/designer desktop (Large devices (desktops, 1920px and up, e.g. most pro design screens) 
*/

/* Note: We use a mix of "em" and "rem" dimensions throughout this css. 
Therefore adjusting body font size will alter any media queries and other dimensions that are based on "em". 
Feel free to change but be aware of possible unintended consequences :)  */

.body {
  font-family: "Gotham A", "Gotham B", Arial, sans-serif; /* Gotham Book via typography.com */
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.3;
  color: #3b3b3b;
}
h1, .h1, h2, .h2, h3, h4, h5 {
  font-family: "Knockout 48 A", "Knockout 48 B", "Franklin Gothic", sans-serif;
  line-height: 1;
  font-style: normal;
  font-weight: 400;
  text-transform: uppercase;
}
.lead {font-size:1.3em;}
.center {text-align:center;}

h1 {
  font-size: 5.6rem;
}

h2 {
  font-size: 4.8rem;
}

h3 {
  font-size: 3.6rem;
}

p, li {
  font-size: 1.6rem;
  line-height: 2.8rem;
}/* ---------------------------------
Upper Navbar styles 
--------------------------------- */

#upper-nav {
  position:fixed;
  top:0;
  height:10rem;
  padding:1rem 3rem;
  background-color:#fff;
  color:#000;
  text-align:right;
  z-index:3;
  margin: 0;
}

#upper-nav a.nzstory-logo {
  text-decoration:none;
  display:inline-block;
  float:left;
}

#upper-nav img {
  margin:auto;
  height:6.8rem;
  max-height:10rem; 
}

#upper-nav div.upper-nav-menu {
  display:inline-block; 
  float:right;
  margin-top:3rem;
}
#upper-nav .upper-nav-menu a {
  text-decoration:none;
  color:#000;
  font-weight:400;
  font-size:1.6rem;
  text-align:right;
  line-height:2rem;
  padding:1rem 0;
  margin:1rem 2.2rem;
}


#upper-nav .upper-nav-menu a:hover, #upper-nav .upper-nav-menu a.selected {
  color: #000;
  transition: color .1s ease-in-out 0s;
  border-bottom:2px solid var(--blue);
  opacity:1;
}



.preview-mode #upper-nav {
  top: 6rem !important;
}

--*/
/* ---------------------------------
Navbar styles 
--------------------------------- */
#navbar {top:10rem;}
.navbar-section {
  margin-top:10rem;
  padding-top: 0;
  padding-bottom: 0;
  /* navbar account name color */
  color: var(--navcol);
  /* navbar color */
  background-color: var(--navbg);
  /* navbar border at the bottom */
  border-bottom: 1px solid var(--navbg);
}


/* navbar icons text color */
.navbar-section .selection-count,
.navbar-section .avatar-user-dropdown,
.nav-icon-text,
/* mobile menu */
.navbar-section-content a,
.navbar-section-content .dropdown-button {
  color: var(--navcol);
  font-weight:400;
}

/* navbar user dropdown border color */
.navbar-section .avatar-user-dropdown {
  border-color: var(--navcol);
}

/* dropdown */
.navbar-section-content .dropdown-button:hover,
.navbar-section-content .dropdown-button:focus-within {
  opacity: 0.7;
}

/* caret icon changes direction when menu is open - preview bar and search filters too */
.dropdown-button:focus-within .css-icon-caret-down,
.filter-name:focus-within .css-icon-caret-down {
  transform: rotate(180deg);
}

/* nav dropdown mobile */
.navbar-section-content .dropdown-content {
  background-color: var(--navbg);
  color: var(--navcol);
  border: none;
  width: max-content;
  box-shadow: none;
}

/* user dropdown */
.user-dropdown .dropdown-options {
  background-color: var(--navbg);
  color: var(--navcol);
  border: 2px solid var(--navbg);
}

.navbar-section-content .dropdown-content a:hover,
.user-dropdown .dropdown-options a:hover {
  background-color: #121212;
  opacity: 0.7;
}

/* Hide logo and account name on mobile */
.account-logo .logo {
  display: none; 
  max-height: 4rem;
}
.account-logo {display:none;}

span.account-name {
  font-size: 1.6rem;
  display: none;
}


@media (min-width: 62em) {
  /* Adjust height and spacing for logo on desktop */
  .navbar-section {
    margin-top:10rem;
    height: 10rem;
  }

  .account-logo .logo,
  span.account-name {
    display: block;
    max-height: 10rem;
    padding: 0.5em 0;
    display:none;
  }	
  /* nav dropdown desktop */
  .navbar-section-content .dropdown-content {
    box-shadow: 0 .8rem 1.6rem #0003;
    max-height: 80vh;
    overflow-y: scroll;
  }
  .account-logo {display:none;}
}
.footer-section {
  background-color: #1a1a1a;
  color: #868686;
}

.footer-section h3 {
    font-family: Gotham Book,sans-serif;
    font-weight: 700;
    text-transform: none;
    font-size: 1.6rem;
    line-height: 3rem;
}

.footer-section a, .footer-two p {font-size: 1.4rem;}

.footer-section h3, .register {
  color: #fff;
}

.register p {font-size: 1.8rem;}

.footer-top-three {
  display: grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, max-content);
}

.footer-top article ul {
  list-style: none;
  padding: 0;
}
  
.footer-top article li, .footer-top article p {
  width: 100%;
  display: block;
  text-align: left;
  line-height: 3rem;
}

.footer-top article li a, .menu-1 a, .menu-2 a {
  text-decoration: none;
  display: block;
}

@media (min-width:62em) {
  .footer-top {flex-direction: column;}
  
  .footer-top-three {
    display: grid;
    /* four column grid */
    grid-template-columns: 1fr 1fr 2fr;
    grid-template-areas: 'menu-1 menu-2 register';
    grid-auto-rows: minmax(min-content, max-content);
    grid-column-gap: 2rem;
    align-items: baseline;
  }

  .footer-top article .menu-1, .menu-2 {
    width: 100%;
    display: flex;
    flex-direction: column;
  }
  
  .footer-two {
    flex-direction: row !important;
    justify-content: space-between;
    align-items: center;
  }
  
  .footer-two p {text-align: left;} 
  
  .footer-two article.social-links {
    margin-top: 2rem;
    gap: 2rem !important;
  }
}

.register .button {
  background-color: #1a1a1a;
  border: 1px solid #fff;
  text-transform: uppercase;
  transition: background .3s ease-in-out;
}

.register .button:hover {
  background-color: var(--blue);
  border: 1px solid var(--blue);
  opacity: 1;
}

.footer-two {
  display: flex;
  flex-direction: column-reverse;
  width: 100%;
  padding: 4rem 0;
}

.footer-top .footer-two article p {color: #97989a; font-weight: 600; text-align: center;}

.footer-two article.social-links {
  margin-top: 0;
  display: flex;
  justify-content: center;
  margin-bottom: 2rem;
  gap: 1rem;
}

.footer-two article.social-links a {
    font-size: 1.8rem;
    line-height: 4rem;
    text-align: center;
    border-radius: 50%;
    border: 1.5px solid var(--blue);
    color: #fff;
    width: 6rem;
    height: 6rem;
    transition: background .3s ease-in-out;
}

.footer-two article.social-links a:hover {
  background-color: var(--blue);
  opacity: 1;
}

.menu-1 ul,
.menu-2 ul {
    margin: 0;
    padding: 0;
}

/* icons */
.css-icon-youtube {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path fill="%23ffffff" fill-rule="evenodd" d="M1.172 7.693A55.991 55.991 0 0 0 1 12c0 1.632 0.08 3.167 0.182 4.44 0.146 1.817 1.531 3.206 3.318 3.33 1.794 0.125 4.305 0.23 7.5 0.23 3.195 0 5.706 -0.105 7.5 -0.23 1.787 -0.124 3.172 -1.513 3.318 -3.33 0.102 -1.273 0.182 -2.808 0.182 -4.44 0 -1.576 -0.074 -3.06 -0.172 -4.307a3.727 3.727 0 0 0 -3.46 -3.46C17.59 4.107 15.164 4 12 4c-3.164 0 -5.591 0.107 -7.368 0.233a3.727 3.727 0 0 0 -3.46 3.46ZM15.5 12 10 9v6l5.5 -3Z" clip-rule="evenodd" stroke-width="1"></path></svg>');
}

.css-icon-twitter {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path fill="%23ffffff" d="M1 19c15.617 6.062 20.038 -5.025 19.905 -10.5C22.173 8.156 23 7.292 23 6.406c-1.048 0.55 -1.595 0.394 -2.119 0 1.128 -0.768 1.071 -1.863 1.071 -2.619 -0.527 0.277 -1.503 0.96 -2.619 1.048 -0.745 -1.166 -2.619 -2.095 -5.238 -1.048 -2.619 1.048 -3.143 3.842 -2.619 5.238 -3.352 0 -7.333 -3.492 -8.905 -5.238 -1.883 2.688 0.5 5.353 1.572 6.286 -0.715 0.214 -1.572 0 -2.095 -0.524 0 2.991 2.619 4.19 3.666 4.715H3.62c0 2.095 2.444 2.968 3.667 3.142 -0.838 0.838 -4.215 1.596 -6.286 1.596Z" stroke-width="1"></path></svg>');
}

.css-icon-facebook {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path fill="%23ffffff" d="M13.5 1A4.5 4.5 0 0 0 9 5.5V9H6.5a0.5 0.5 0 0 0 -0.5 0.5v4a0.5 0.5 0 0 0 0.5 0.5H9v8.5a0.5 0.5 0 0 0 0.5 0.5h4a0.5 0.5 0 0 0 0.5 -0.5V14h2.5a0.5 0.5 0 0 0 0.485 -0.379l1 -4A0.5 0.5 0 0 0 17.5 9H14V7.5A1.5 1.5 0 0 1 15.5 6h2a0.5 0.5 0 0 0 0.5 -0.5v-4a0.5 0.5 0 0 0 -0.5 -0.5h-4Z" stroke-width="1"></path></svg>');
}

.css-icon-linkedin {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path fill="%23ffffff" fill-rule="evenodd" d="M3.5 6a2.5 2.5 0 1 0 0 -5 2.5 2.5 0 0 0 0 5ZM6 23V8H1v15h5ZM8 8h4.5v1.946C13.216 9.005 14.746 8 17.5 8c4.33 0 5.5 4.32 5.5 7v8h-5v-8c0 -1 -0.5 -3 -2.5 -3 -1.42 0 -2.42 1.008 -3 1.951V23H8V8Z" clip-rule="evenodd" stroke-width="1"></path></svg>');
}

.css-icon-instagram {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 48 48"><g id="instagram"><g id="Subtract"><path fill="%23ffffff" d="M24 16a8 8 0 1 0 0 16 8 8 0 0 0 0 -16Z" stroke-width="1"></path><path fill="%23ffffff" fill-rule="evenodd" d="M24 46.5c-4.722 0 -8.545 -0.113 -11.543 -0.264 -5.89 -0.297 -10.396 -4.803 -10.693 -10.693A231.72 231.72 0 0 1 1.5 24c0 -4.722 0.113 -8.545 0.264 -11.543 0.297 -5.89 4.803 -10.396 10.693 -10.693C15.455 1.614 19.277 1.5 24 1.5c4.722 0 8.545 0.113 11.543 0.264 5.89 0.297 10.396 4.803 10.693 10.693 0.15 2.998 0.264 6.82 0.264 11.543 0 4.722 -0.113 8.545 -0.264 11.543 -0.297 5.89 -4.803 10.396 -10.693 10.693 -2.998 0.15 -6.82 0.264 -11.543 0.264ZM12 24c0 -6.627 5.373 -12 12 -12s12 5.373 12 12 -5.373 12 -12 12 -12 -5.373 -12 -12ZM37 8a2 2 0 1 0 0 4h1a2 2 0 1 0 0 -4h-1Z" clip-rule="evenodd" stroke-width="1"></path></g></g></svg>');
}

.css-icon-instagram, 
.css-icon-facebook,
.css-icon-twitter,
.css-icon-linkedin,
.css-icon-youtube {
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  display: inline-block;
}

/* custom social links article */
.social-links {margin-top: 5em;}
.social-links a {
  font-size: 2rem;
  padding: 1rem 2rem;
}/* ---------------------
   Main Elements
   --------------------- */
.body {
  background-color: #212121;
  color: #fff;
}

/* TOP SPACE */
/* add space for user actions menu - except on index */
.main {
  margin-top: 17rem;
  padding-top: 6rem;
  position: relative;
}

.preview-mode .main {padding-top: 11rem;}

#index .main {padding-top: 0;}
#index.preview-mode .main {padding-top: 6rem;} /* add additional space when preview bar is active */

.welcome-paragraph {
  font-size:2rem;
}

mark {
	padding: 1rem 2rem;
	background-color: #f9d147;
    color: black;
}

/* fix code wrapping on mobile */
pre {
  font-family: monospace,monospace;
  font-size: 1em;
  max-width: 100%;
  overflow: auto;
  white-space: normal;
}

/* ------------
   Gallery 
   ------------ */

/*-- Mobile --*/
.gallery-link,
.gallery-image {
  height: 8rem;
}

/*-- Desktop --*/
@media (min-aspect-ratio: 1/1) {
  .gallery-link,
  .gallery-image {
    height: 16rem;
  }
}


/* --------------
   Home Page 
   -------------- */
.intro-logo {
  max-width: 20rem;
}

/* fix download form terms field separation issue */
.form-checkbox.terms {
margin: 5rem 0;
}/* Layout and basic styles of Asset Detail Page */

.albums-section-title {
  display: none;
}

.asset-page-wrapper {
  padding: 2rem;
  align-items: start;
}

@media (min-width:768px) {
  .asset-page-wrapper {
    padding: 6rem;
  }
}

.page-actions {margin-bottom: 0; margin-top: -1px;}

.asset-image-link {
    background-image: linear-gradient(#212121, #000);
    padding: 0;
}

/* fix mobile feed view */
@media and screen(max-width: 62em) {
  .feed-view {width: auto; height: auto;
  }
}

.feed-view .asset {
  background-image: linear-gradient(#212121, #000);
  border: none;
}

.asset:hover .asset-data, 
.asset:hover .asset-buttons,
.masonry-asset:hover {
  background-color: #000;
  opacity: 1;
}

.asset:hover, 
.asset-data:hover, 
.asset-buttons:hover, 
.asset-image-link:hover {
  opacity:1;
  background-color: transparent;
}

.asset-data {
  margin-top: 0;
  padding: 2rem 1rem 0;
}

.asset-data,
.asset-buttons {
  text-align: center;
}

button.asset-action {color:#000;}
.AssetView .asset-page-wrapper a.asset-action.asset-download-button:hover {
  color: #fff;
  opacity: 0.7;
}

.asset-info span:not(.asset-id, .asset-source):before {
  content: ' | ';
}

.asset-source:before {
  content: 'src: ';
}

.asset-page-wrapper.post .asset-proxy-section,
.asset-page-wrapper.post .asset-details-section,
.asset-page-wrapper.post .asset-tags-section{
  max-width: 90rem;
  margin: auto;
  width: 100%;
}

.asset-page-wrapper.post .asset-proxy-section{
  margin-top:2rem;
}

.asset-tags-title,
.asset-type-title,
.asset-size-title,
.asset-filename-title,
.asset-dimensions-title,
.asset-type-value,
.asset-extension-title,
.asset-release-date,
.asset-created-at,
.asset-id-title,
.asset-licence-title,
.asset-word-count-title{
  display:none;
}

.asset-licence-value:before{
  content: ' -';
  margin-right: 0.5rem;
}

.asset-licence-subtitle:after,
.asset-expiry-date-title:after,
.asset-created-at-title:after,
.asset-release-date-title:after,
.asset-credit-title:after,
.asset-usage-title:after{
  content:':';
}

.AssetView .asset-title {
  font-size: 2rem;
  flex: 0 0 100%;
}

.asset-page-main .asset-type,
.asset-page-main .asset-size,
.asset-page-main .asset-extension,
.asset-page-main .asset-id{
  width: 33%;
  display: inline;
}

.asset-details-section {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  font-weight: 500;
  font-size: 1.6rem;
  line-height: 2.8rem;
}

.asset-details-section article {
  flex: 1;
  flex: 0 0 100%;
}

.asset-details-section article p {
  margin: 0;
}

.asset-details-section .asset-type,
.asset-details-section .asset-size,
.asset-details-section .asset-dimensions,
.asset-details-section .asset-extension,
.asset-details-section .asset-id,
.asset-details-section .asset-word-count{
  flex: 0 0 content;
}

.asset-type-icon,
.asset-license-icon,
.asset-expiry-date-icon,
.asset-created-at-icon,
.asset-release-date-icon,
.asset-credit-icon,
.asset-usage-icon,
.asset-reference-icon,
.asset-location-icon {
  float: left;
  margin-right: 1rem;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
}

.masonry-asset .asset-name {
    line-height: 1.6rem;
}

/* Asset View */
.AssetView .asset-page-wrapper a,
.AssetView .asset-page-wrapper button.asset-action {
  color: #fff;
  font-size: 1.4rem;
  line-height: 2.4rem;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 600;
  border: none;
}
.basket-bar button {color: #fff;}
.asset-buttons a:hover,
.AssetView .asset-page-wrapper a:hover,
.AssetView .asset-page-wrapper button.asset-action:hover,
.AssetView .breadcrumb-section:hover a,
.basket-bar a:hover,
.basket-bar button:hover {
  color: var(--blue);
  opacity: 1;
}

.asset-add-to-basket-button {white-space: nowrap;}

/* icon colour */
.asset-buttons button svg path,
.asset-buttons a svg path,
.AssetView svg path,
.basket-bar svg path {
  stroke: #fff;
}

/* save and arrow icons fill colour */
.AssetView .icon-save path,
.basket-bar .icon-save path,
.AssetView .breadcrumb-section .arrow-left path {
  stroke: none;
  fill: #fff;
}

.AssetView button:not(.navbar-button):hover svg path ,
.AssetView a:hover .icon-save path,
.basket-bar a:hover .icon-save path,
.basket-bar .close-basket-button:hover .icon-arrow-right path,
.AssetView .breadcrumb-section:hover .arrow-left path {
  stroke: none;
  fill: var(--blue);
}

.asset-buttons {padding-bottom: 2rem;}

.AssetView a:not(.navbar-button):hover svg path,
.asset-buttons a:hover svg path, 
.asset-buttons a:active svg path,
.basket-bar a:hover svg path,
.basket-button-clear-all:hover svg path {
  stroke: var(--blue);
}

.asset {border-radius: 2px;}

.AssetView .asset-extension:before,
.AssetView .asset-id:before,
.AssetView .asset-size:before,
.AssetView .asset-dimensions:before,
.AssetView .asset-word-count:before{
  content: ' | ';
  margin-left: 0.5rem;
}

.AssetView .asset-id:before {
  content: '#';
  margin-right: -0.4rem;
}

.AssetView .asset-latitude:before {
  content:'Latitude: ';
}
.AssetView .asset-longitude:before {
  content:'Longitude: ';
}

/* Margins and paddings */
.AssetView .asset-details-section article {
  margin-bottom: 1.2rem;
}

.AssetView .asset-terms-of-use a {
  border-bottom: 2px solid #DCAB5C;
  padding-bottom: 0.5rem;
}

.asset-page-wrapper .section {
  padding: 0;
}

.asset-tags {
  margin-top: 3rem;
}

/* added to solve tag wrapping */
.asset-tags a {
  font-size: 1.2rem;
  line-height: 1.8rem;
  float: left;
  margin: 0 0.8rem 1.2rem 0;
}

.tag.selected-tag {
  background-color: #000;
}

.asset-term-of-use {
  margin-top: 1rem;
}

.AssetView .asset-body {
  margin-bottom: 1.8rem;
}

.AssetView .asset-body p {
  margin: 0;
}

.AssetView .asset-type-icon {
  order: 2;
  margin-bottom: 0.8rem;
  flex: unset;
}

.AssetView .asset-name {
  order: 1;
  width: 100%;
  font-size: 5.6rem;
}
aside.related-assets-section .asset-grid-name{
  font-size: 1.2rem;
}

.AssetView .asset-id {
  order: 3;
}

.AssetView .asset-extension {
  order: 4;
}

.AssetView .asset-word-count {
  order: 4;
}

.AssetView .asset-size {
  order: 5;
}

.AssetView .asset-dimensions {
  order: 6;
}

.AssetView .asset-description {
  order: 7;
}

.AssetView .asset-licence {
  order: 8;
}

.AssetView .asset-terms-of-use {
  order: 9;
  padding-bottom: 1rem;
}

.AssetView .asset-expiry-date {
  order: 10;
}

.AssetView .asset-release-date {
  order: 11;
}

.AssetView .asset-created-at {
  order: 12;
}

.AssetView .asset-credit {
  order: 13;
}

.AssetView .asset-usage {
  order: 14;
}

.AssetView .asset-reference {
  order: 15;
}

.AssetView .asset-account {
  order: 15;
  display:none;
}

.AssetView .asset-location {
  order: 16;
}

/* adds some separation to the related assets section in Portal */
.related-assets-section {
  border-top: 1px dotted #ccc;
  margin-bottom: 5em;
}

/* move proxy in assets to top in mobile but preserve post positioning */
.asset-page-wrapper .section.breadcrumb-section {padding:1em 0;}
.asset-page-wrapper {
  grid-template-areas: "breadcrumb breadcrumb breadcrumb" "proxy proxy proxy" "details details details"  "tags tags tags" "actions actions actions";
}
.asset-page-wrapper.post {
  grid-template-areas: "breadcrumb breadcrumb breadcrumb" "proxy proxy proxy" "tags tags tags" "actions actions actions";
}

.asset-actions-section {
    grid-area: actions;
    display: flex;
    gap: 0.7rem;
    flex-direction: column;
    justify-content: flex-end;
    margin-top: 2rem;
    margin-bottom: 0;
}

@media (min-width: 62em) {
  .asset-page-wrapper .section.breadcrumb-section {padding:0;}
  .asset-proxy-section {
    margin-left: 5rem
  }
  .asset-page-wrapper .section.breadcrumb-section {padding:0;}
  .asset-page-wrapper {
    grid-template-areas: "breadcrumb actions actions" "details proxy proxy" "tags tags tags";
  }
  .asset-page-wrapper.post {
    grid-template-areas: "breadcrumb actions actions" "proxy proxy proxy" "tags tags tags";
  }
      
  .asset-actions-section {
    flex-direction: row ;
    margin-bottom: 5rem;
    margin-top: 0
  }
}

/* stop right click save */
img.proxy-preview {
  pointer-events: none;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* bring videos up */
video.proxy-preview {object-position: top;}

.asset-type-icon {margin-right: 0.5rem;}

/* swap out icons */
/* image */
.asset.asset-type-image .asset-name .asset-type-icon, 
.masonry-asset.asset-type-image .asset-name .masonry-asset-type-icon, 
.image .asset-details-section .asset-type-icon,
.basket-asset-type-icon-image {
  content: url('https://dwvt5wwshu97q.cloudfront.net/accounts/20/static_files/01HGF29XNPB84XZS1TWFDP672Z/image-icon-white.svg?v=63868531989');
}

/* video */
.asset.asset-type-video .asset-name .asset-type-icon, 
.masonry-asset.asset-type-video .asset-name .masonry-asset-type-icon, 
.video .asset-details-section .asset-type-icon,
.basket-asset-type-icon-video {
  content: url('https://dwvt5wwshu97q.cloudfront.net/accounts/20/static_files/01HGF2B0P225NZ5A5CXF534ZHZ/play-circle-white.svg?v=63868532025');
}

/* presentation */
.asset.asset-type-presentation .asset-name .asset-type-icon, 
.masonry-asset.asset-type-presentation .asset-name .masonry-asset-type-icon, 
.presentation .asset-details-section .asset-type-icon,
.basket-asset-type-icon-presentation {
  content: url('https://dwvt5wwshu97q.cloudfront.net/accounts/20/static_files/01HGF2B916A1VW486B7BEHM5BJ/presentation-icon-white.svg?v=63868532034');
}

/* document */
.asset.asset-type-document .asset-name .asset-type-icon, 
.masonry-asset.asset-type-document .asset-name .masonry-asset-type-icon, 
.document .asset-details-section .asset-type-icon,
.basket-asset-type-icon-document {
  content: url('https://dwvt5wwshu97q.cloudfront.net/accounts/20/static_files/01HGF2973Z251VN47EFFKSRSHW/book-icon-white.svg?v=63868531966');
}

/* post */
.asset.asset-type-post .asset-name .asset-type-icon,
.masonry-asset.asset-type-post .asset-name .masonry-asset-type-icon,
.post .asset-details-section .asset-type-icon,
.basket-asset-type-icon-post {
  content: url('https://dwvt5wwshu97q.cloudfront.net/accounts/20/static_files/01HGYB7DH02830CYAQ34QRCPYV/post-icon-typing-machine-white.svg?v=63869044661');
}

/* vector */
.asset.asset-type-vector .asset-name .asset-type-icon,
.masonry-asset.asset-type-vector .asset-name .masonry-asset-type-icon,
.vector .asset-details-section .asset-type-icon,
.basket-asset-type-icon-vector {
  content: url('https://dwvt5wwshu97q.cloudfront.net/accounts/20/static_files/01HGYR6Z5K7S5CWPMATM3R40A1/vectors-anchor-rectangle-icon-white.svg?v=63869058277');
}

/* archive */
.asset.asset-type-archive .asset-name .asset-type-icon, 
.masonry-asset.asset-type-archive .asset-name .masonry-asset-type-icon, 
.archive .asset-details-section .asset-type-icon,
.basket-asset-type-icon-archive {
  content: url('https://dwvt5wwshu97q.cloudfront.net/accounts/20/static_files/01HGYAYVC5C0KK4FF9FKQT2Y1R/zip-file-icon-white.svg?v=63869044380')
}

/* link */
.asset.asset-type-link .asset-name .asset-type-icon, 
.masonry-asset.asset-type-link .asset-name .masonry-asset-type-icon, 
.link .asset-details-section .asset-type-icon,
.basket-asset-type-icon-link {
  content: url('https://dwvt5wwshu97q.cloudfront.net/accounts/20/static_files/01HGYBZJSW4VQ4PDZT3CVC0K2Z/hyperlink-icon-white.svg?v=63869045453')
}

/* other */
.asset.asset-type-other .asset-name .asset-type-icon, 
.masonry-asset.asset-type-other .asset-name .masonry-asset-type-icon, 
.other .asset-details-section .asset-type-icon,
.basket-asset-type-icon-other {
  content: url('https://dwvt5wwshu97q.cloudfront.net/accounts/20/static_files/01HGYR5CVGZJF52AVCJCBWWDK8/file-heart-icon-white.svg?v=63869058226')
}

/* Contain asset name within one line to fix ugly multiline gap with icon */
.asset-grid-name,
.masonry-asset .asset-grid-name {
  display: inline-block;
  max-width: 200px; /* Adjust as needed */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.active .asset-view rect {stroke: #fff;}

.transparent {background-size: auto;}

/* related assets */
.select-all-component {
  position: relative;
  text-align: left;
  margin-left: 0;
  margin-top: 0;
}

@media (min-width: 62em) {
  .select-all-component {
    position: absolute;
    margin-left: 24rem;
    margin-top: -8rem;
  }
}

.select-all {
  background-color: transparent;
}

.select-all-button {
  background-color: transparent;
  border: 1px solid #fff;
  color: #fff;
}

.select-all-button:hover {
  color: var(--blue);
  border-color: var(--blue);
}/* Sign Up Page styles */
.new-account-section .form-section {
  background-color:transparent;
  padding:0;
}

.new-account-hint {font-size:2.5rem;}

.new-account-section .form-section form {
  background-color:antiquewhite;
  border-radius:1em;
  padding:1em;
}

@media screen and (min-width: 75em) {
  .new-account-section .form-section {
    width: 33vw;
    min-width:30em;
    margin:1em auto;
    background-color:transparent;
  }
  .new-account-section .form-section form {
    background-color:antiquewhite;
    border-radius:1em;
    padding:2em;
  }
  .new-account-section .new-account-embeded-image {
    padding:3rem;
    max-width:66vw;
  }
  blockquote {padding:2em;}
  blockquote span {
    display:block;
    width:100%;
    font-size:2.2rem;
    font-weight:bold;
  }
  blockquote cite {
    display:block;
    width:100%;
    font-size:1em;
    text-align:center;
  }	
  .signup-faq {
    margin:2.5%;
    text-align:left!important;
    padding-top:1em;
  }
}
/* show hide mobile and desktop specific content */
/* breakpoint use em (not rem) at 62em x 16px = 992px */ 
@media (max-width:48em) {
  .desktop {display:none!important;}
}
@media (min-width:48.1em) {
  .mobile {display:none!important;}
  .desktop {display:block!important;}
}

/* faq styles */
dl {
  column-count: 1;
  column-gap: 0rem;
}

.fw dl {
  column-count: 1;
  column-gap: 0rem;
}
@media (min-width:48em) {
  dl {
    column-count: 2;
    column-gap: 5rem;
  }
  .fw dl {
    column-count: 3;
    column-gap: 5rem;
  }
}

dt {font-weight:bold;}
dt.subtitle {
  border-bottom: 2px solid #000;
  margin:2rem 0;
}
dt.subtitle:first-child {
  border-bottom: 2px solid #000;
  margin:0 0 2rem 0;
}
dd {margin-bottom:1rem;}
main.wall-main {
  padding-left:1em;
  padding-right:1em;
}

.bk-wall {
  background-color: #111;
}

.bk-wall .brandkit-logo,
.bk-wall .logo {
  max-height: 20rem;
  filter: invert();
}

.bk-wall .button {
  line-height: 2.8rem;
}

@media screen and (min-width: 36em) {
  .bk-wall {
    margin: 10em auto 4em auto;
    padding:3rem 6rem
  }
}

@media screen and (min-width: 48em) {
  .bk-wall {
    margin: 10em 4em;
  }
}
.reset-password-section {
  background-color:#fff;
  width:fit-content;
  margin:0 4em;
}

/* over-ride hover colour */
.login-without-password-link:hover, .forgot-password-link:hover {
  color: #fff;
  border-color: #fff;
}

.bk-wall-body .hint {padding-bottom:1em;}

.bk-wall-body .error-hint {
  color:red; 
  padding-top:1em;
}

@media screen and (min-width: 48em) {
  .bk-wall.bk-wall-transfer {
    max-width: 66rem;
  }
}/* full width section */
.fw {padding:4em 0;}

@media (min-width:77rem) {
  .fw {
    width:100vw;
    padding:4em 0;
  } 
}

/* full height section */
.fh {
  padding-top:0;
  padding-bottom:0;
}

/* two column grids used throughout site */
.two-col-grid {
  display:grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, max-content);
  grid-column-gap: 2em;
  grid-row-gap: 2em;
}

.two-col-grid article {
  display:grid;
  grid-auto-rows: minmax(min-content, max-content);
}

/* Tablet Breakpoint 768px / 16px = 48em */
@media (min-width:48em) {
  .two-col-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 6em;
    grid-row-gap: 6em;
  }
}  
/* end 2 col grid */

/* 3 column grids used throughout site */
.three-col-grid {
  display:grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, max-content);
  grid-column-gap: 2em;
  grid-row-gap: 2em;
}

.three-col-grid article {
  display:grid;
  grid-auto-rows: minmax(min-content, max-content);
}

@media (min-width: 62em) {
  .three-col-grid {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 4em;
    grid-row-gap:4em;
  }
}

/*  Desktop Breakpoint 1200px / 16px = 75em*/ 
@media (min-width:75em) {
  .three-col-grid {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 4em;
    grid-row-gap:4em;
  }
}  
/* end 3 col grid */

/* 4 column grids used throughout site */
.four-col-grid {
  display:grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(min-content, max-content);
  grid-column-gap: 2em;
  grid-row-gap: 2em;
}

.four-col-grid article {
  display:grid;
  grid-auto-rows: minmax(min-content, max-content);
}

/*  Desktop Breakpoint 768px / 16px = 48em */ 
@media (min-width:48em) {
  .four-col-grid {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 2em;
    grid-row-gap:2em;
  }
}

/*  Desktop Breakpoint 1200px / 16px = 75em */   
@media (min-width:75em) {
  .four-col-grid {
    display:grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-column-gap: 2em;
    grid-row-gap:2em;
  }
}  
/* end 4 col grid */
section .intro, #intro {
  text-align:center;
}

section.blackbg {
  background-color: #121212;
  color: #fff!important;
}

section.whitebg {
  background-color: #fff;
  color: #000!important;
}

section.darkgreybg {
  background-color: #212121;
  color: #fff;
}

/* reset section padding on occasion */
.tight-bottom {padding-bottom:0;}
.tight-top {padding-top:0;}
.tight-left {padding-left:0;}
.tight-right {padding-right:0;}

/* html section */
.html-section {
  width:100vw;
  padding-top:6rem;
  padding-left:2em;
  padding-right:2em;
  padding-bottom:6em;
  margin-top: -1px; /* fixes appearance of white line */
}

.html-section img {margin: 2em auto;}
.html-section p img {margin: 0 auto;}
.html-section:first-child {padding-top: 6rem;}

/* text over carousel */
#hero-title {
  position: absolute;
  display: flex;
  align-items: flex-end;
  width: 100%;
  top: 0;
  height: calc(100vw/1.33); /* 4:3 aspect */
  z-index: 1;
}

.hero-title {
  color: #fff;
  font-size: 9vw;
  line-height: 8vw;
  max-width: 70vw;
  padding-right: 4vw;
  text-align: left;
  text-shadow: 0px 4px 12px rgb(0 0 0 / 8%), 0px 24px 64px rgb(0 0 0 / 12%);
  margin: 0 auto;
}

@media (min-width: 36em) {
  .hero-title {
    font-size: 7vw;
    line-height: 6.6vw;
  }
}

@media (min-width: 48em) {
  #hero-title {
    padding: 0 0 4vw;
    height: calc(100vw/2.76) !important;
  }
}

@media (min-width: 62em) {
  .html-section,
  .cookies-section,
  .notifications-section, 
  .related-assets-section {
    padding-left:3em; 
    padding-right:3em;  
  }
  
  /* text over carousel */
  #hero-title {
    height: calc(100vw/2.76) !important;
    padding: 0 0 4vw;
  }
}  

@media (min-width: 75em) {
  .html-section,
  .cookies-section,
  .notifications-section,
  .related-assets-section {
    padding-left:calc(50vw - 34.5em); 
    padding-right:calc(50vw - 34.5em);   
  }
  
  #filter-links,
  #assets-filter-links {justify-content: center !important;}
}  

@media (min-width: 120em) {
  .html-section,
  .cookies-section,
  .notifications-section,
  .related-assets-section {
    padding-left:calc(50vw - 45em); 
    padding-right:calc(50vw - 45em);  
  }
}

#latest-resources, #promote-nz {
  padding-left: 5vw;
  padding-right: 5vw;
}

#latest-resources h2, #promote-nz h2 {
  font-size: 8rem;
  line-height: 7.6rem;
  margin: 0 0 3.6rem;
}

#latest-resources p, #promote-nz p {
  line-height: 2.8rem;
  margin: 0 0 1.5rem;
}

#latest-resources a:not(.button) {
  font-size: 4.8rem;
  font-family: "Knockout 48 A", "Knockout 48 B", "Franklin Gothic", sans-serif;
  font-weight: 400;
  text-transform: uppercase;
  text-decoration: none; 
  display: flex;
  flex-direction: column;
}

#latest-resources img {margin: 0;}

/* terms */
section.terms-intro h1, section.terms h1 {
  font-size: 8.4rem;
  line-height: 8rem;
  text-transform: uppercase;
  margin: 0 0 4.5rem;
}

section.terms-intro article.checklist p {
  padding-left: 4rem;
}

/* tick mark CSS only */
.check {
  position: absolute;
  transform: rotate(45deg);
  height: 20px;
  width: 10px;
  border-bottom: 3px solid #fff;
  border-right: 3px solid #fff;
  margin-left: -4rem;
}

section.terms-intro article p, section.terms article p {
  margin-bottom: 2rem;
}.button,
.normal-button {
  background-color: var(--blue);
  color: #fff;
  text-transform: uppercase;
  padding: 1rem 2rem;
  line-height: normal;
}

.cancel-button, .cancel-my-account-button, .danger-button {
  color: red; 
  text-decoration: underline; 
  background-color: #fff;
  padding: 1rem 2rem;
  width: max-content;
  line-height: normal;
}

.forgot-login-button,
.button-with-border {
  background-color: transparent;
  color: #fff;
  border: 1px solid white;
  text-transform: uppercase;
  padding: 1rem 2rem;
}

.edit-profile-button {
  width:100%;
}
.normal-button.save-profile-changes-button,
.normal-button.save-profile-changes-button  {
  padding: 1rem 2rem;
}

a:hover,
.asset-add-to-basket-button:hover,
.clear-search-btn:hover {
  opacity:0.6;
}

button:hover {
  cursor: pointer;
  opacity: 0.6;
}

.modal-close {
  color: inherit;
}

.asset-action.asset-download-button,
.asset-action.login-button {
  background-color: var(--blue);
}

a.asset-action.login-button:hover {
  color: #fff;
  opacity: 0.7;
}/* Albums widget */
section.albums-section {padding: 2rem;}

.albums-grid .album {
  aspect-ratio:3 / 2; /* sets aspect ratio of album covers consistently when height is calculated */
  height: -webkit-fit-content; /* Safari fix */
} 

.albums-grid .album-cover, .albums-horizontal-grid .album-cover {
  min-height: auto; /* height fix */
}

/* album border */
.album-cover,.album-with-no-cover {
  border: none;
}

.album-cover:hover, .album-with-no-cover:hover {
  border:none;
}

/* new album select state */
a.album-selected {
  border: none;
  box-shadow: none;
}

a.album-selected img, a.album-selected div.album-with-no-cover {
  border:5px solid #f9d147;
  box-shadow: 0 15px 25px 1px #ccc;
}

a.album-selected span.album-title {
  color:#000;
  font-weight:bold;
}
/* end album select state */

@media screen and (min-width: 62em) {
  section.albums-section {padding: 2rem 5%;}
  
  .albums-horizontal-grid .album-wrapper {
	max-width: 100%;
    overflow-wrap: normal;
    flex-wrap: wrap;
  }
  
  .albums-grid .album-wrapper {
    justify-content: flex-start !important;
  }
}

.albums-grid .album-wrapper {
  padding: 4rem 0;
  justify-content: center;
}

.albums-grid .album-title {
  background: #111;
  color: #fff;
  text-transform: uppercase;
  font-size: 1.2rem;
  margin-top: -1px;
}
.albums-grid .album-description {
  background: #111;
  color: #fff;
  padding:1em;
  font-size: 1.2rem;
}
.albums-grid .album-description:empty {display:none;}/* carousel */

#carousel {
  position: relative;
  overflow: hidden;
  line-height: 0;
  height: 100%;
  padding: 0;
}

.carousel-container {
    display: flex;
    transition: transform 1s ease;
}

.carousel-slide {
    flex: 0 0 100%; /* Ensure each slide takes full width */
}

.carousel-slide img {
    width: 100%;
    margin: 0 auto;
}

/* left and right navigation (hidden) */
.prev,
.next {
    position: absolute;
    top: 25%;
    background-color: red;
    cursor: pointer;
    height: 50%;
    width: 10%;
    z-index: 2;
    opacity: 0;
}

.prev {
    left: 0;
}

.next {
    right: 0;
}

/* slide indicators */
.carousel-dots {
  position: absolute;
  bottom: 5rem; 
  left: 50%;
  transform: translateX(-50%); /* Corrects horizontal centering */
  z-index: 2;
}

/* z-index has no effect so dots when basket is open */
.open-basket .carousel-dots {display: none;}

.dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    background-color: #ccc;
    border-radius: 50%;
    margin: 0 5px;
    cursor: pointer;
}

/* active slide indicator */
.dot.active {
    opacity: 100%;
}

/* inactive slide indicator */
.dot:not(.active) {
    opacity: 50%;
}/* BK2 round search box and clear button */

.search-box {
  position: relative;
  display: flex;
  align-items: center;
  padding: 0 3rem 0 1rem;
  margin-bottom: 1.5rem;
  height: 6rem;
  width: 100%;
  border-radius: 6rem;
  border: 1px solid #ccc;
  background-color: #fff;
}

.assets-button {
  border-radius: 6rem; 
  background-color:var(--blue);  
  border:2px solid #fff;
}

.clear-search-button {
  position: absolute;
  top: 0;
  right: 0;
  border: none;
  height: 100%;
  width: 6rem;
  border-radius:6rem;  
  background-color:var(--blue);  
  border:2px solid #fff;  
  color: inherit;
}

.clear-search-button svg.icon-cross {fill:black;} 
.clear-search-button:hover {opacity:0.6;}

.search-section {
  max-width: 120rem;
  margin: 0 auto; 	
  background-color: #121212;
}

#searchbox.search-box-section.desktop {
  position: relative; 
  top: -6rem; 
  margin-bottom: -12rem;
  z-index: 1;
}
.desktop .search-box-component {max-width: 70vw;}
.desktop .search-box {min-height: 6rem;}

.search-box input {font-weight: 700;}

.mobile .search-box-component {margin-top: calc(100vw/1.3);}

/* filters */
.filters{
  justify-content: center;
}

.filter-options {
  background-color: #111;
}

.filter-options .filter-option:hover {
  color: #fff;
  background-color: var(--blue); /* blue */
}

.filter-options .filter-option.selected {
  font-weight: bold;
  background-color: transparent;
  color: #fff;
}

.button.normal-button.filter-button:hover {
  opacity: 0.7;
}

/* custom filter-links section */
#filter-links, #assets-filter-links {
  padding: 8rem 4rem 4rem;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  overflow-x: auto;
  white-space: nowrap;
}

#filter-links a, #assets-filter-links a {
  font-size: 1.4rem;
  font-weight: 500;
  text-decoration: none;
  display: flex;
  align-items: center;
  background-color: transparent;
  color: #fff;
  padding: 1rem 3rem 1rem 1.5rem;
  border-radius: 2rem;
  border: none;
  text-decoration: none;
  height: 4rem;
}

#filter-links a img, #assets-filter-links a img {
  padding-right: 1rem;
}

#assets-filter-links {
  position: absolute; 
  top: 0; 
  padding-top: 25rem;
}

#assets-filter-links a.active {
  background-color: #fff;
  color: #1a1a1a;
}

#assets-filter-links a.active img {filter: invert(1);}

/* advanced filters */
section.filters-section {
  color: #fff;
  font-size: 1.4rem;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 16rem;
  padding-bottom: 2rem;
}

.filter {
  background-color: #212121;
  border: none;
}

@media screen and (min-width: 36em) {
  .filter {
    background-color: transparent;
  }
  
  .filter svg { 
    height: 0.9rem;
  }
}

#advanced_filters {width: 100%;}

.filters .filter-name {
  color: #fff;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 2rem;
}

.filters svg.icon-caret-down path {
  stroke: #fff;
  stroke-width: 3;
}

.filter-options {
  min-width: 24rem;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 2rem;
  border: none;
  border-radius: 2px;
}

.filters .filter-options .css-icon,
.filters .filter-options svg {
  display: none;
}

.filter-options .filter-option.selected {
    font-weight: bold;
    background-color: #a7a9ac;
    color: #fff;
    fill: #fff;
}

.advanced-search-option {max-width: 100%;}

.filters .advanced-filters-section {
    text-align: right;
}

.show-filters-button svg path,
.hide-filters-button svg path {stroke: #fff; fill: #fff;} 
/* ----------------
   Search grid
   ---------------- */

.search-grid-section {background-color: #121212;}

.select-button .css-icon {
  color: #fff;
}

.search-grid-section .page-actions, 
.search-grid-section .grid, 
.search-grid-section .assets-pagination, 
.AssetView,
.masonry-asset,
.Static,
.NotificationView,
.CookiesPreferencesView,
.PageView,
.BasketView {
  background-color: #212121;
  color: #fff;
}
.search-label {
  display: none;
}

.search-grid-section .page-actions, 
.search-grid-section .grid, 
.search-grid-section .assets-pagination {
  padding-bottom: 4rem;  
}

/* Search grid and myHistory pagination */
.pagination-button,
.button.pagination-button {
    background-color: transparent;
    border: 1px solid #fff;
    border-radius: 2px;
    margin: 0 2px;
}

.pagination-button .css-icon,
.button.pagination-button .css-icon {
  color: #fff;
}

.pagination-button:hover,
.button.pagination-button:hover {
  border-color: #111;
  background-color: var(--blue);
}

.pagination-button:hover .css-icon
.button.pagination-button:hover .css-icon {
  color: #111;
}

/* sort dropdown */
.assets-found-and-sort {font-size: 1.1rem;}

.order-form-select {
  appearance: none;
  background-color: transparent;
  color: #fff;
  border: 1px solid;
  letter-spacing: 0;
  font-weight: 700;
  font-family: "Gotham A", "Gotham B", Arial, sans-serif;
  padding-right: 25px;
  background-image: url('https://dwvt5wwshu97q.cloudfront.net/accounts/20/static_files/01HGRQVN1AXAR5HFYKW9K0VQJZ/chevron-down-white.svg?v=63868856580'); 
  background-repeat: no-repeat;
  background-position: right 5px center;
}

.order-form-select:hover {
  color: var(--blue);
  background-image: url('https://dwvt5wwshu97q.cloudfront.net/accounts/20/static_files/01HGRR71KP91WV4984GW0XMVWT/chevron-down-gold.svg?v=63868856953'); 
}

.change-grid-view .icon-text {
display: none;
}

.change-grid-view.active {
  color: #fff;
}

.file-icon::before{
  border-color: var(--primary-color) var(--primary-color) rgba(255, 255, 255, .3) rgba(255, 255, 255, .35);
}

/* ----------------
   Masonry view 
   ----------------- */
.masonry-asset {
  margin-bottom: 2rem;
  padding: 0;
  float: left;
}
.masonry-asset:hover {opacity:0.6;}
.masonry-asset .asset-grid-icon {position:relative;}
.masonry-asset .asset-grid-name {margin-left:0;}
.masonry-view .asset-data {background-color: #111;}

/* ------------
Feed view 
---------------- */
.feed-view .asset-name {
	text-align:left;
  	justify-content:left;
}
.feed-view .asset-grid-name {
  font-size: 1.2em;
  text-align: left;
  font-weight: bold;
}
.feed-view .feed-asset-type-icon {display:none;}

/* show the Search label and the And/Or toggle in the Search Grid */
label.search-label {
  display: block;
  padding-left: 3rem;
}

.search-strategy .change-strategy-button {color: #fff;}/* BASKET styling */

/* hide labels in asset grid */
.AssetView.open-basket .asset-download-button,
.AssetView.open-basket .asset-share-button,
.AssetView.open-basket .asset-save-button,
.AssetView.open-basket .asset-edit-button {display:none;}

.basket-bar {
  background-color: #000;
  color: #fff;
/*  width: 120rem; */
  right: -120rem;
}

@media screen and (min-width: 100em) {
  .basket-bar {
    width: 58rem;
    right: -58rem;
  }
}

.basket-actions {
  align-items: center;
}

.basket-button-clear-all {
  color: #fff;
}

.basket-button-clear-all:hover {color: var(--blue);}

.close-basket-button {
  border: 1px solid;
  background-color: transparent;
}

.close-basket-button:hover {
  border: 1px solid var(--blue);
  color: var(--blue);
}

.basket-asset {
  background-color: #a7a9ac;
  color: #fff;
}

/* fix appearance of thin line beneath image - better at top */
.basket-asset-image {margin: 0 1rem 0 0 ;}

.basket-asset-image.transparent {    
  background-color: #a7a9ac;
  background-image: linear-gradient(45deg,#a7a9ac 25%,transparent 25%,transparent 75%,#a7a9ac 75%,#a7a9ac),linear-gradient(45deg,#a7a9ac 25%,transparent 25%,transparent 75%,#a7a9ac 75%,#a7a9ac);
}

.basket-bar .basket-asset a svg path,
.basket-bar .basket-asset button svg path {
  stroke: #fff;
}

.basket-bar .basket-asset a:hover svg path,
.basket-bar .basket-asset button:hover svg path {
  stroke: #000;
}

/* hide icons on asset cards */
.asset-card {background-color: #a7a9ac;}
.asset-card-icon {display: none;}

.breadcrumb-section {
  color: #fff;
  background-color: transparent;
  border-bottom: none;
}

.no-search-result {background: transparent;}

/* my basket */
.my-basket-section .select-all {
    margin-top: 5rem;
}

.basket-bar {
  background-color: #111;
  color: #fff;
  box-shadow: -1px 2px 2px hsl(0deg 0% 20% / 0.333), -2px 4px 4px hsl(0deg 0% 20% / 0.333), -3px 6px 6px hsl(0deg 0% 20% / 0.333);
}

.basket-asset-buttons {
  margin-left: auto;
}

.hint, 
.date,
.timeline-time,
.optional {
  color: #a7a9ac; /* grey colour from NZ Story logo */
}

/* box container */
section.assets-action-box, 
.profile-section, 
.me-section, 
.shares-section, 
.transfers-section,
.me-section.share-section, 
.me-section.transfer-section,
.bk-wall.bk-wall-share, 
.bk-wall.bk-wall-transfer,
.wall-section.request-section, 
.asset-download-section.assets-action-box, 
.download-basket-section.assets-action-box, 
.asset-share-section.assets-action-box, 
.share-basket-section.assets-action-box, 
.save-basket-section.assets-action-box, 
.my-collection-section.assets-action-box {
  background-color: #111;
  border: 2px solid #212121;
}

.share-assets .asset-card-buttons .select-button, 
.share-assets .asset-card-buttons .selected-button, 
.share-assets .asset-card-buttons .asset-card-button, 
.download-assets .asset-card-buttons .asset-card-button, 
.save-assets .asset-card-buttons .asset-card-button, 
.collection-assets .asset-card-buttons .asset-card-button, 
.collection-assets .asset-card-buttons .select-button {
  background-color: rgba(0,0,0,0.25);
  color: inherit;
}

/* modal */
.modal {  
  background-color: #111;
  border: 2px solid #212121;
  box-shadow: -1px 2px 2px hsl(0deg 0% 20% / 0.333), -2px 4px 4px hsl(0deg 0% 20% / 0.333), -3px 6px 6px hsl(0deg 0% 20% / 0.333);
}

.modal-background {
  background-color: rgba(0, 0, 0, 0.8);
}

.close-basket-button,
.button.asset-details-button {
  background-color: var(--blue);
  border-color: var(--blue);
  padding: 1rem 3rem;
}

.close-basket-button:hover {
  opacity: 0.7;
  color: #fff;
}

.basket-asset,
.terms-and-consent-to-collect,
.asset-card {
  background-color: #212121;
}

/* my profile, my history, contributions */
.profile-section .initials-value,
.my-history-section .initials-value {
  color: #111;
}

.profile-section .initials,
.my-history-section .initials {
  background-color: var(--lightgrey);
  display: flex;
  align-items: center;
  justify-content: center;
}

.profile-details .change-email-button, 
.profile-details .change-password-button,
.index-table-link, 
.index-table-action-link {
  color: var(--blue);
}

.timeline .audit-title-link {
  color: var(--blue);
}

/* my collections */
.table-responsive {
  background-image: none;
  background-color: #111;
}

/* red delete link
.my-collections-buttons .index-table-action-link,
.share-action-buttons .index-table-action-link {
  color: #da7470;
}*/

/* contributions */
.upload-entry {
  background-color: var(--darkgrey);
}

.upload-file-size {
  color: #212121;
}

.contribution-description {
  background-color: #111;
  color: var(--lightgrey);
}

.asset-contribution {
  background-color: transparent;
}

/* history timeline lines */
@media screen and (min-width: 36em) {
  .timeline .event,
  .timeline:before {
      border-color: #555;
  }
}

/* success - ie in two-factor authentication */
.success-message {background-color: #212121;}


/* contribution flow */
.upload-entry {background-color: #a7a9ac;}

.asset-contribution {
  display: flex;
  align-items: center;
  background-color: #121212;
  color: #fff;
  margin-bottom: 1.6rem;
  padding: 1rem;
  gap: 1rem;
  flex-direction: column;
}.admin .asset-modal-content h1.asset-name, 
.portal-modal .asset-modal-content h1.asset-name {
  font-size: 5rem;
  font-weight: 600;
  overflow-wrap: anywhere;
  line-height: 1.2;
}

.modal-background {
  background-color: rgba(51, 51, 51, 0.9);
  backdrop-filter: blur(1px);
}

.modal {
  border: 2px solid #212121;
  box-shadow: none;
}

.share-assets .asset-card img.transparent, .download-assets .asset-card img.transparent, .save-assets .asset-card img.transparent, .collection-assets .asset-card img.transparent {
    background-color: #ececec;
    background-image: linear-gradient(45deg, #e6e6e6 25%, transparent 25%, transparent 75%, #e6e6e6 75%, #e6e6e6), linear-gradient(45deg, #e6e6e6 25%, transparent 25%, transparent 75%, #e6e6e6 75%, #e6e6e6);
    background-size: auto;
    background-position: 0 0, 2rem 2rem;
}

.share-assets .asset-card-buttons .select-button, 
.share-assets .asset-card-buttons .selected-button, 
.share-assets .asset-card-buttons .asset-card-button, 
.download-assets .asset-card-buttons .asset-card-button, 
.save-assets .asset-card-buttons .asset-card-button, 
.collection-assets .asset-card-buttons .asset-card-button, 
.collection-assets .asset-card-buttons .select-button {
    background-color: transparent;
    color: inherit;
}

.share-assets .asset-card-buttons .select-button .css-icon,
.share-assets .asset-card-buttons .selected-button .css-icon, 
.share-assets .asset-card-buttons .asset-card-button .css-icon, 
.download-assets .asset-card-buttons .asset-card-button .css-icon, 
.save-assets .asset-card-buttons .asset-card-button .css-icon, 
.collection-assets .asset-card-buttons .asset-card-button .css-icon, 
.collection-assets .asset-card-buttons .select-button .css-icon {
    color: #000;
}/* reverse colours on new Share Modal */
.share-transfer-section {
    color: #fff;
	}

.share-button-icon {
    background-color: #fff;
    color: #111;
}
.share-button-label {
  color:#fff;
}

/* reverse colours on post transfer page */
.me-section.transfer-section {
	background-color:#111;
}

.bk-wall.bk-wall-transfer {
	background-color:#111;
}

  /* noticed an issue with notofactions page as well */
.notification-card {
  background-color:#111; /* reverse colour on My Notifications page https://toolkit.nzstory.govt.nz/me/notifications */
}

.transfer-message-value {font-size:2rem; margin-bottom:1em;}
.transfer-information {border-left:0;padding-left:0;}

.radio-label {line-height:2;margin-top:1rem;}/* increase space between share method choices */
.share-page-title legend {margin-bottom:1rem;}

.download-button-section .info {
  color: #111;
}

.success {background: var(--success-dark);}